import { Engine, Color3, DynamicTexture, FollowCamera, Camera, HemisphericLight, Vector3, Sprite, Scene, ArcRotateCamera, PointLight, StandardMaterial, Texture, ShaderMaterial, IAnimationKey, AssetsManager, MeshAssetTask, AbstractMesh, PickingInfo, Mesh, Animation, MeshBuilder, Material, SceneLoader, ActionManager, InterpolateValueAction, SetValueAction } from 'babylonjs'
import 'babylonjs-loaders';
// @ts-ignore
import MeshWriter from "meshwriter";
import conf, { createText } from './textConf'

// 文本
export class Animate2 {
  private dom: HTMLCanvasElement
  private engine: Engine
  private scene: Scene
  private camera: ArcRotateCamera

  constructor(dom: HTMLCanvasElement) {
    this.dom = dom
    this.engine = new Engine(this.dom, true)  // 设置引擎
    this.scene = new Scene(this.engine)   // 创建场景

    // 纵轴旋转45°
    this.camera = new ArcRotateCamera("Camera", Math.PI / 180 * 45, Math.PI / 180 * 45, 200, Vector3.Zero(), this.scene, true); // 创建相机
    // console.log(this.camera)
    this.camera.lowerBetaLimit = null as unknown as number
    this.camera.upperBetaLimit = null as unknown as number
    this.camera.lowerAlphaLimit = null as unknown as number
    this.camera.upperAlphaLimit = null as unknown as number
    this.camera.lowerRadiusLimit = null as unknown as number
    this.camera.upperRadiusLimit = null as unknown as number



    this.camera.lowerRadiusLimit = 30;   // 缩放最小距离
    this.camera.upperRadiusLimit = 3000; //限制相机距离焦点最远距离
    this.camera.attachControl(this.dom, false)  // 把相机放到画布
    let that = this




    // 创建半球光
    const light = new HemisphericLight('light', new Vector3(10, 5, 5), this.scene);
    const x = Mesh.CreateLines('x', [Vector3.Zero(), new Vector3(1000, 0, 0)], this.scene)
    x.color = new Color3(1, 0, 0);
    const y = Mesh.CreateLines('y', [Vector3.Zero(), new Vector3(0, 1000, 0)], this.scene)
    y.color = new Color3(0, 1, 1);
    const z = Mesh.CreateLines('z', [Vector3.Zero(), new Vector3(0, 0, 1000)], this.scene)
    z.color = new Color3(1, 0, 1);


    //  console.log(SceneLoader.ImportMesh('m', '/', '1.stl', this.scene));
    const mesh = Mesh.CreateBox('1', 20, this.scene)
    
    // 事件触发
    let axixy = 0;
    mesh.actionManager = new ActionManager(this.scene)
    mesh.actionManager.registerAction(
      new InterpolateValueAction(
        ActionManager.OnPointerOverTrigger,
        mesh,
        'visibility',
        0.5,
        1000
      )
    )
    mesh.actionManager.registerAction(
      new InterpolateValueAction(
        ActionManager.OnPointerOverTrigger,
        mesh,
        'scaling.x',
        5,
        1000
      )
    )
    mesh.actionManager.registerAction(
      new InterpolateValueAction(
        ActionManager.OnPointerOutTrigger,
        mesh,
        'visibility',
        1,
        1000
      )
    )
    mesh.actionManager.registerAction(
      new InterpolateValueAction(
        ActionManager.OnPointerOutTrigger,
        mesh,
        'scaling.x',
        1,
        1000
      )
    )
    // 事件


  }


  render() {
    // 引擎渲染场景
    this.engine.runRenderLoop(() => {
      this.scene.render()
    })
  }

}


